<template>
	<view class="content">
		<view style="background-color: #2e91f6; color: #FFFFFF;padding: 30rpx;">
			<view class="top_name">{{profile.fullname||''}}</view>
			<view class="top_name" style="font-size: 25rpx;">用户名：{{profile.username}}</view>
			<view class="loginout">
				<u-tag text="退出登录" @click="loginOut()" type="warning" shape="circleLeft"/>
			</view>
			<u-row gutter="16" class="top_count">
				<!-- 	<u-col span="6" style="border-right: dotted 1px #f8f8f8;" @tap="toScore()">
						<view class="top_count_count">
							100分
						</view>
						<view class="top_count_des">
							评分
						</view>
					</u-col> -->
					<u-col span="12">
						<view class="top_count_count">
							{{getDay(profile.userInfo.registerDate)}}天
						</view>
						<view class="top_count_des">
							注册时长
						</view>
					</u-col>
			</u-row>
		</view>
		<view class="top_bar">
			<u-icon name="order" size="30" style="margin-right: 10rpx;"></u-icon>
			工作上报（选择项目进行上报）
		</view>
		<view class="updata" >
			<view class="tb_items" v-for="(sons,i) in items">
				<view class="tb_items_title"><u-icon name="grid" color="#007AFF" style="margin-right: 10rpx;"></u-icon>{{sons.title}}</view>
				<view style="padding:20rpx;">
					<u-row gutter="16" justify="space-between" >
						<u-col class="u-margin-bottom-15" span="12" offset="0" v-for="(item,it) in sons.children">
							<view class="tb_item" @tap="toList(item.title,item.id)">
								<view class="tb_item_first ">
									{{item.title | firstChar}}
								</view>
								<view class="tb_item_title u-line-2" >
									{{item.title}}
									<u-tag v-if="item.total>0" :text="'已填'+item.total+'条'" type="success" size="mini"  class="label" />
									<u-tag v-if="item.total==0" text="未填写" type="info" size="mini"  class="label" />
								</view>
								<view>
									<u-icon name="arrow-right-double" style="color: #C0C0C0;"></u-icon>
								</view>
							</view>
						</u-col>
					</u-row>
				</view>
				

			</view>
		</view>
	</view>
</template>

<script>
	import request from '../../util/request.js'
	import api from '../../util/api.js'
	import check from '../../util/check.js'
	export default {
		data() {
			return {
				userInfo:null,
				title: 'Hello',
				profile:'',
				userInfo:'',
				item:'',
				profile:'',
				items:[]
			}
		},
		filters: {
			firstChar: function(value) {
				return value.substr(0, 1);
			}
		},
		onShow() {
			this.getItems();
			
		},
		onLoad() {
			this.userInfo=check.checkLogin();
			this.getProfile();

		},
		methods: {
			getDay(val){
				let date=this.$u.timeFormat(val,'yyyy-mm-dd');
				return check.getBeforeDate(date);
			},
			getProfile:function(){
				request.postf(api.profile,{
					id:this.userInfo.uid
				}).then(response=>{
					console.log(response);
					this.profile=response.data.data[0];
					
					
				}).catch(ex=>{
					console.log(ex);
					uni.showToast({
						icon:'none',
						title:'请求失败，请稍后再试',
						
					})
				})
			},
			getItems:function(){
				uni.showLoading({
					title:'数据加载中...'
				})
				request.post(api.itemList,{
					status:1,
					project_id:'1352084243575660546',
					userId:this.userInfo.uid
				}).then(response=>{
					console.log(response);
					this.items=response.data.data;
					uni.hideLoading();
					
				}).catch(ex=>{
					console.log(ex);
					uni.showToast({
						icon:'none',
						title:'请求失败，请稍后再试',
						
					})
				})
			},
			toList:function(title,id){
				uni.navigateTo({
					url:'../list/list?title='+title+'&id='+id,
				})
			},
			// toScore(){
			// 	uni.navigateTo({
			// 		url:'../score/score'
			// 	})
			// }
			loginOut(){
				uni.clearStorage();
				uni.showToast({
					icon:'none',
					title:'退出登录成功'
				})
				uni.navigateTo({
					url:'../login/login'
				})
			}

		}
	}
</script>

<style>
	.content {

		background-color: #f8f8f8;
	}
	.top_name{
		font-size: 32rpx;
		margin-bottom: 30rpx;
		text-align: center;
	}
	.loginout{
		position: absolute;
		top: 40rpx;
		right: 0;
	}
	.top_count{
	}
	.top_count_count{
		text-align: center;
		margin-bottom: 20rpx;
		font-size: 35rpx;
		font-weight: bold;
	}
	.info_list_title{
		border-left: solid 10rpx #0095f0;
		padding: 0 10rpx;
		margin: 20rpx 0;
		font-size: 35rpx;
		font-weight: 500;
	}
	.top_count_des{
		text-align: center;
		color: #f4f4f5;
		
	}
	.top_bar{
		background-color: #FFFFFF;
		padding: 20rpx;
		font-weight: bold;
	}
	.updata {
		padding-top: 30rpx;
	}

	.tb_items {
		
	
	}

	.tb_items_title {
		padding: 20rpx 30rpx;
		font-weight: bold;
		margin-bottom: 10rpx;
		background-color: #e3eff8;
		
	}

	.tb_item {
		position: relative;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
		background-color: #FFFFFF;
		padding: 20rpx;
		height: 120rpx;
		margin-bottom: 20rpx;
	}

	.tb_item_first {
		background-color: #007AFF;
		width: 60rpx;
		height: 60rpx;
		padding: 10rpx;
		color: #FFFFFF;
		font-weight: 500;
		display: inline;
		flex: 0;
		
		
	}

	.tb_item_title {
		flex: 1;
		padding-left: 10rpx;
		padding-right: 25rpx;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
	.label{
			position: absolute; 
			top:0rpx;
			right: 1rpx;
			border-radius: 0rpx 0 0 0rpx !important;
			
	       

	}
</style>
